/*
 * @Author: xiaosihan
 * @Date: 2022-07-16 17:37:58
 * @Last Modified by: xiaosihan
 * @Last Modified time: 2024-08-11 20:11:19
 */

import {
  DoubleSide,
  Mesh,
  MeshBasicMaterial,
  MeshLambertMaterial,
  PlaneGeometry,
} from "three";
import SpriteText from "three-base/SpriteText";

/**
 * 面板文字
 * @export
 * @class TextPlanMesh
 * @extends {Mesh}
 */
export default class TextPlanMesh extends Mesh {
  constructor(text: string) {
    super(TextPlanMesh.planeGeometry);

    this.spriteText.text = text;

    this.material = new MeshBasicMaterial({
      transparent: true,
      side: DoubleSide,
      map: this.spriteText.material.map,
    });

    this.addEventListener("mouseenter", (e) => {
      this.setHeightLight(true);
    });

    this.addEventListener("mouseleave", (e) => {
      this.setHeightLight(false);
    });
  }

  static planeGeometry = new PlaneGeometry(1, 1, 1, 1);

  spriteText = (() => {
    const spriteText = new SpriteText("");
    // @ts-ignore
    spriteText.padding = [4, 4];
    spriteText.backgroundColor = "#E9DAFF";
    spriteText.borderWidth = 0.3;
    spriteText.borderColor = "#5503FA";
    spriteText.color = "#5503FA";
    // #5503FA 

    return spriteText;
  })();

  // 设置高亮
  setHeightLight(heightLight: boolean) {
    this.spriteText.backgroundColor = heightLight ? "#5503FA" : "#E9DAFF";
    this.spriteText.color = heightLight ? "#E9DAFF" : "#5503FA";
    (this.material as MeshLambertMaterial).map = this.spriteText.material.map;
  }
}
